<template>
    <pagetitle type="2"></pagetitle>
    <el-card>
        <el-table :data="pageData.tableData" style="width: 100%" default-expand-all row-key="messageId" class="configurationtable">
            <el-table-column prop="category" label="消息类型" width="380" />
            <el-table-column label="站内信">
                <template #default="scope">
                    <el-checkbox v-model="scope.row.mail" true-label="2" false-label="1" label="" size="large" @change="settingConfig(scope.row)" />
                </template>
            </el-table-column>
            <el-table-column label="短信">
                <template #default="scope">
                    <el-checkbox v-model="scope.row.sms" true-label="2" false-label="1" label="" size="large" @change="settingConfig(scope.row)" />
                </template>
            </el-table-column>
            <el-table-column label="邮箱">
                <template #default="scope">
                    <el-checkbox v-model="scope.row.email" true-label="2" false-label="1" label="" size="large" @change="settingConfig(scope.row)" />
                </template>
            </el-table-column>
            <el-table-column label="说明" prop="content" />
        </el-table>
    </el-card>
</template>
<script lang="ts" setup>
import { ref, reactive } from "vue";
import { getInformConfig, setInformConfig } from "@/api/inform";
const pageData = reactive({
    tableData: [],
    queryData: {
        category: "",
        content: "",
        messageId: "",
    },
});
// const configurationtable = ref(null);
// 获取用户消息接收配置
const getUserInformConfig = () => {
    getInformConfig(pageData.queryData).then((res) => {
        pageData.tableData = res.data;
    });
};
getUserInformConfig();
// 设置选择接收类型
const settingConfig = (row: any) => {
    console.log(row);
    const data = {
        receiveMethodId: row.receiveMethodId,
        email: row.email,
        sms: row.sms,
        mail: row.mail,
        receiveState: 2,
        messageId: row.messageId,
    };
    setInformConfig(data).then((res) => {
        console.log(res);
    });
};
</script>
